<template>
	<view class="bindingInviteCode-container">
		<view class="content-box">
			<image src="@/static/login/shopCar.png" class="shopCar"></image>
			<view class="title-text">你好，请输入邀请码</view>
			<view class="input-box">
				<u-input v-model.trim="inviteCode" type="text" placeholder="请输入邀请码" class="invite-input" />
			</view>
			<view @click="confirmFun('reg')" class="btn-box">确认</view>
			<view @click="confirmFun('justGuang')" v-if="!hideTips" class="StrollingAround">没有口令，先逛逛</view>
		</view>
	</view>
</template>

<script setup>
import { onLoad } from '@dcloudio/uni-app';
import { ref } from 'vue';
import { register } from '@/api/login.js';
import RSA from '@/utils/rsa.js';
import { publicKey, privateKey } from '@/utils/secretKey';
import { useUserStore } from '@/store/userStore.js';

const userStore = useUserStore();

const hideTips = ref(false);
const userPhone = ref('');
const inviteCode = ref('');
onLoad((options) => {
	// 我的页面跳转来不显示tips
	hideTips.value = options.hideTips ? true : false;

	// 拿用户手机号
	userPhone.value = options.phone;
});

// 确认
const confirmFun = async (flag) => {
	if (flag == 'reg' && !inviteCode.value) {
		uni.showToast({
			title: '请输入邀请码',
			icon: 'none'
		})
		return;
	}
	
	let userData = {
		phone: userPhone.value,
		inviteCode: inviteCode.value,
		source: 1
	}
	
	let rsa_encrypt_res = await RSA.encrypt(userData, publicKey);
	
	let login_res = await register(rsa_encrypt_res);
	
	let rsa_decrypt_res = await RSA.decrypt(login_res.data);
	
	console.log('解密数据', rsa_decrypt_res);
	
	if (login_res.code == 0) {
		userStore.setUserToken(rsa_decrypt_res.access_token);
		userStore.assignUserAccessInfo(rsa_decrypt_res);
		
		uni.switchTab({
			url: '/pages/home/index'
		})
	}
};
</script>

<style lang="scss" scoped>
.bindingInviteCode-container {
	background-image: url('~@/static/login/bindingInviteCode-bg.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	height: 100vh;
	width: 100vw;
	padding: 178px 40px 120px;

	.content-box {
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;

		.shopCar {
			width: 200px;
			height: 194px;
			margin-bottom: 20px;
		}

		.title-text {
			font-size: 26px;
			font-weight: 600;
			line-height: 36.4px;
			text-align: center;
			margin-bottom: 60px;
		}

		.input-box {
			display: flex;
			align-items: center;
			width: 100%;
			height: 50px;
			padding: 16px 20px;
			border-radius: 34px;
			margin-bottom: 20px;
			background-color: #fff;

			.invite-input {
				width: 100%;
				font-size: 14px;
				line-height: 18px;
			}
		}

		.btn-box {
			display: flex;
			align-items: center;
			justify-content: center;
			color: #fff;
			width: 100%;
			height: 52px;
			font-weight: 500;
			font-size: 16px;
			border-radius: 34px;
			margin-bottom: 32px;
			background: linear-gradient(90deg, #ff0309 0%, #ff6c2a 100%);
		}

		.StrollingAround {
			color: #999999;
			font-size: 14px;
			font-weight: 400;
			line-height: 18px;
			text-align: center;
		}
	}
}
</style>
